<template>
  <div>
    <ol>
        <li>禁止使用 999999, 9999 , 999 层级</li>
        <li>自定义 z-index 注意根据页面布局 调整层级使用 </li>
        <li>element-puls 回到顶部组件 z-index:5</li>
        <li>element-puls 下拉菜单 dropdown组件 z-index:10</li>
        <li>element-puls dialog .el-overlay 组件 z-index:2000+</li>
        <li>element-puls 抽屉 drawer .el-overlay 组件 z-index:2000+</li>
        <li>element-puls Message 消息提示 组件 z-index:2100+</li>
        <li>element-puls MessageBox 消息弹框 .el-overlay 组件 z-index:2100+</li>
        <li>element-puls Notification 通知  z-index:2100+</li>
        <li>element-puls Popover 弹出框 z-index:2100+</li>
        <li>element-puls Tooltip 文字提示 z-index:2100+</li>
       
    </ol>
  </div>
</template>

<script lang="ts" setup>
import { ref, onMounted, nextTick } from "vue";
import { MoreFilled } from "@element-plus/icons-vue";
import { demoProps } from "@/stores/modules/merakDemo";
import dropWrap from "../dropWrap.vue";
import Prism from "prismjs";
import "../prism.css";

/* 生命周期 */
onMounted(() => {
  nextTick(() => {
    Prism.highlightAll();
  });
});
</script>
<style lang="scss" scoped>
</style>